본문으로 건너뛰기

Next js 설치

설치

npx create-next-app@latest

설치 진행

What is your project named? -> 프로젝트가 설치될 폴더명
you like to use TypeScript? Yes -> 패키지 설치
Would you like to use ESLint? Yes -> 패키지 설치
Would you like to use Tailwind CSS? No -> 패키지 설치
Would you like to use src/ directory? No -> src 폴더 생성 여부(pages, styles 관리)
Would you like to use App Router? (recommended) No -> App 또는 Pages Router 설정
Would you like to customize the default import alias? Yes -> 절대 경로 설정
What import alias would you like configured? @ -> 절대 경로에 쓰일 Alias 설정

다음은 gpt에서 설명하는 종속성에 대한 내용이다.

디렉토리 구성

node_modules : 프로젝트에서 사용하는 모든 패키지와 의존성들이 저장되는 곳
pages : (pages router 기준) 디렉토리 내의 파일(명)을 기반으로 페이지를 자동으로 라우팅
public : 디렉토리에 위치한 파일들은 Next.js 서버에서 정적으로 서비스
styles : 전역 CSS 파일이나 스타일 모듈들을 저장하는데 사용
.eslint.json : 프로젝트의 ESLint 구성을 정의
.gitignore : Git 저장소에 포함되지 않아야 할 파일들을 지정
next-env-d.ts : TypeScript 정의 파일로, Next.js 환경에 대한 타입 정보를 포함
next.config.js : Next.js의 환경 설정을 커스터마이징하는데 사용
package-lock.json : 프로젝트의 dependencies tree를 잠금 처리, 이를 통해 버전을 맞출 수 있음
package.json : Node.js 프로젝트 설정 파일로, 프로젝트의 이름, 버전, 의존성 패키지들 등을 정의
README.md : 프로젝트를 설명하는 Markdown
tsconfig.json : TypeScript 프로젝트 설정 파일로, TypeScript 컴파일러 옵션을 정의

설치